<template>
	<view class="page">
		<view @click="login()">
			<view class="u-flex user-box">
				<view class="u-m-r-20">
					<u-avatar :src="userInfo.img ? userInfo.img : ''" size="140"></u-avatar>
				</view>
				<view class="u-flex-1">
					<view class="u-font-18">{{ hasLogin ? userInfo.realname : '点击登录' }}</view>
					<view class="u-font-14 u-tips-color">职位：{{ userInfo && userInfo.post ? userInfo.post : '--' }}</view>
				</view>
			</view>
			<view class="u-m-t-50 u-p-r-20 u-p-l-20" v-if="hasLogin">
				<u-button type="error" @click="bindLogout">退出登录</u-button>
			</view>
		</view>
		<view class="vs_box" >
			{{vs}}{{dev}}
		</view>
		
		<u-tabbar :list="vuex_tabbars" class="my-tabbars"></u-tabbar>
	</view>
</template>

<script>
export default {
	data() {
		return {
			hasLogin: false,
			userInfo: {},
			vs:'',
			dev:''
		};
	},
	computed: {},
	onShow() {
		this.getUserInfo();
		this.getVersion();
	},
	methods: {
		login() {
			if (!this.hasLogin) {
				this.bindLogin();
			}
		},

		bindLogin() {
			uni.navigateTo({
				url: '/pages/login/login',
			});
		},

		bindLogout() {
			const self = this;
			uni.showModal({
				title: '提示',
				content: '确定退出？',
				success(res) {
					if (res.confirm) {
						self.$store
							.dispatch('LogOut')
							.then((res) => {
								uni.navigateTo({
									url: '/pages/login/login',
								});
							})
							.catch((res) => {
								console.log(res);
							});
					}
				},
			});
		},

		getUserInfo() {
			let self = this;
			self.$store
				.dispatch('GetUserInfo')
				.then((res) => {
					self.userInfo = res.data;
					self.hasLogin = true;
				})
				.catch((res) => {
					self.hasLogin = false;
					console.log(res);
				});
		},
		getVersion(){
			let url = this.$api.common.getBASE_URL();
			if(url.indexOf("dev") > 0){
				this.dev = '-测试版'
			}else {
				this.dev = '-正式版'
			}
			this.vs = uni.getStorageSync("app_version");
			
		},
	},
};
</script>

<style lang="scss" scoped>
.user-box {
	margin: 30rpx 0;
	padding: 20rpx 30rpx;
	background: #fff;
}
.vs_box {
	width: 100%;
	text-align: center;color: #737373;
	position: fixed;  
	bottom: 60px;
}
</style>
